
<div class="navbar">
  <div class="navbar-inner">
    <div class="left sliding"><a href="index.html" class="back link"><i class="icon icon-back"></i><span>Back</span></a></div>
    <div class="center sliding">Virtual List</div>
    <div class="right"><a href="#" class="open-panel link icon-only"><i class="icon icon-bars"></i></a></div>
  </div>
</div>
<div class="pages navbar-through">
  <div data-page="virtual-list" class="page">
    <form data-search-list=".virtual-list" class="searchbar searchbar-init">
      <div class="searchbar-input">
        <input type="search" placeholder="Search"/><a href="#" class="searchbar-clear"></a>
      </div><a href="#" class="searchbar-cancel">Cancel</a>
    </form>
    <div class="searchbar-overlay"></div>
    <div class="page-content">
      <div class="content-block">
        <p>Virtual List allows to render lists with huge amount of elements without loss of performance. And it is fully compatible with all Framework7 list components such as Search Bar, Infinite Scroll, Pull To Refresh, Swipeouts (swipe-to-delete) and Sortable.</p>
        <p>Here is the example of virtual list with 10 000 items:</p>
      </div>
      <div class="list-block virtual-list searchbar-found media-list"></div>
      <div class="list-block searchbar-not-found">
        <ul>
          <li class="item-content">
            <div class="item-inner">
              <div class="item-title">Nothing found</div>
            </div>
          </li>
        </ul>
      </div>
    </div>
  </div>
</div>